<template>
  <div>
    <h1>elementui</h1>
    <el-date-picker
      v-model="value1"
      type="date"
      placeholder="选择日期"
      size="large"
      format="yyyy-M-dd"
      value-format="yyyy-MM-dd"
      @change="data"
    >
    </el-date-picker>
    <input
      type="text"
      placeholder="输入内容"
      :disabled="isTrue"
      v-model="iptVal"
    />
    <hr />
    <div class="block">
      <p>组件值：{{ value }}</p>
      <el-date-picker
        value-format="yyyy-MM-dd"
        v-model="value"
        type="daterange"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
        :default-time="['00:00:00', '23:59:59']"
      >
      </el-date-picker>
    </div>
     <el-select v-model="valuexzq" placeholder="请选择">
    <el-option
      v-for="item in list"
      :key="item.id"
      :label="item.name"
      :value="item.id">
    </el-option>
  </el-select>
  </div>
</template>

<script>
export default {
  data() {
    return {
      value1: "",
      isTrue: true,
      value: "",
      iptVal: "",
      //选择器
       options: [{
          value: '选项1',
          label: '黄金糕'
        }, {
          value: '选项2',
          label: '双皮奶'
        }, {
          value: '选项3',
          label: '蚵仔煎'
        }, {
          value: '选项4',
          label: '龙须面'
        }, {
          value: '选项5',
          label: '北京烤鸭'
        }],
        valuexzq:3,
        list:[
          {
            name:"张三",
            id:0
          },
          {
            name:"李四",
            id:1
          },
          {
            name:"王五",
            id:2
          },
          {
            name:"李六",
            id:3
          },
        ]
    };
  },
  methods: {
    data(v) {
      if (v != null) {
        this.isTrue = false;
      } else {
        this.iptVal = "";
        this.isTrue = true;
      }
      console.log(v, "v");
    },
  },
};
</script>

<style>
</style>